<template>
    <div class="home-content">
        <div>
            <div class="head">
                <el-image :src="homeBanner" fit="contain"></el-image>
            </div>
            <div class="content">
                <div class="text">进出登记，点击下面按钮</div>
                <div class="in" @click="jump(1)">
                    <el-image :src="'../../static/images/in-scan.png'" :fit="'contain'"></el-image>
                </div>
                <div class="out" @click="jump(2)">
                    <el-image :src="'../../static/images/out-scan.png'" :fit="'contain'"></el-image>
                </div>
            </div>
        </div>
        <com-buttom></com-buttom>
    </div>
</template>

<script>
    import homeBanner from '../../static/images/home.png'
    import comButtom from './buttom'

    export default {
        data() {
            return {
                show: true,
                homeBanner: homeBanner,
                inUrl: '../../static/images/in-scan.png',
                outUrl: '../../static/images/out-scan.png',
                tk: null
            }
        },
        computed: {},
        mounted() {
            // if (this.$route.query.nsukey) {
            //     // window.href = location.origin + location.pathname + '?tk=' + this.tk
            //     window.open(location.origin + location.pathname + '?tk=' + this.tk, '_self', null, true)
            // }
            if (this.$route.query.tk) this.tk = this.$route.query.tk
        },
        methods: {
            jump(type) {
                let path = '/registration'
                this.$http.get('/cardRecord/getUserCarInfo').then(result => {
                    if (result.success) {
                        if (Number(result.data.peopleType) === 1) path = 'outsideCarRegister'
                        this.$router.push({
                            path: path,
                            query: {
                                role: type,
                                qrresult: this.tk || ''
                            }
                        })
                    }
                })
            }
        },
        components: {
            comButtom
        }
    }
</script>

<style scoped lang="less">
    .home-content {
        height: 100%;
        width: 100%;
        overflow-x: hidden;
        overflow-y: auto;
        background-image: linear-gradient(#93ABFF, #fff);

        .head {
            text-align: center;
            height: 2.5rem;
            background-size: cover;
            background-position: top center;
            background-repeat: no-repeat;
            padding: .45rem;
            margin-top: .3rem;

            .el-image {
                width: 100%;
                height: 100%;
            }
        }

        .content {

            .text {
                margin-top: .2rem;
                color: #fff;
                font-size: .4rem;
                text-align: center;
            }

            .in {
                float: left;
                width: 2rem;
                height: 2rem;
                margin-top: 2.2rem;
                margin-left: 1rem;
                // margin: .8rem auto;
                margin-bottom: 0;

                .el-image {
                    width: 100%;
                    height: 100%;
                    border-radius: 50%;
                }
            }

            .out {
                float: left;
                width: 2rem;
                height: 2rem;
                margin-top: 2.2rem;
                margin-left: .8rem;
                // margin: .5rem auto;

                .el-image {
                    width: 100%;
                    height: 100%;
                    border-radius: 50%;
                }
            }
        }
    }
</style>
